<% extends "common/msui.html" %>
<% block title %>地址编辑<% endblock %>
<% block body %>
<div class="page" id="address-edit" ms-controller="address_edit">
  <header class="bar bar-nav">
    <a class='button button-link button-nav pull-right' style='margin-right:5px' ms-click='address_update' ms-visible="address.state == 'edit' "><span>完成</span></a>
    <a class='button button-link button-nav pull-right' style='margin-right:5px' ms-click='address_update' ms-visible="address.state == 'new' "><span>添加</span></a>
    <a class="button button-link button-nav pull-left back" href="/mshop/products" >
      <span class="icon icon-left"></span>
      返回
    </a>
    <h1 class="title">{{address.title}}</h1>
  </header>

  <div class="content address-edit-content" >
    <ul>
      <li><div><span>收货人姓名</span><input type='text' ms-duplex='address.name' class='address-edit-content-required' ms-class="address-edit-content-required-warning:warning == 'name'" /></div></li>
      <li><div><span>所在区域</span><input type="text" id='city-picker' ms-duplex='address.province' class='address-edit-content-required' ms-class="address-edit-content-required-warning:warning == 'province'" /></div></li>
      <li><div><span>手机号码</span><input type='number' ms-duplex='address.phone' class='address-edit-content-required' ms-class="address-edit-content-required-warning:warning == 'phone' " /></div></li>
      <li><div><span>详细地址</span><input type='text' ms-duplex='address.street' class='address-edit-content-required' ms-class="address-edit-content-required-warning:warning == 'street' " /></div></li>
      <li><div><span>邮政编码</span><input type='number' ms-duplex='address.zip' /></div></li>
    </ul>
  </div>

  <script type="application/javascript" >
    $(function() {
      var address_id = ${address_id|safe}
      var partner_id = ${partner_id|safe}

      function check_required() {
        var attr_list = ['name', 'province', 'phone', 'street'];
        for (var index in attr_list) {
          if (!address_edit_vm.address[attr_list[index]]) {
            address_edit_vm.warning = attr_list[index];
            break;
          };
        };

        if (address_edit_vm.warning) {
          setTimeout(function() {address_edit_vm.warning = false}, 200);
        };
      };

      $.ajax({
        url: '/mshop/customer/address/get',
        data: {address_id: address_id},
        type: 'post',
        success: function(e) {
          address_edit_vm.address = JSON.parse(e);
          $('#city-picker').val(address_edit_vm.address.province || '');
          $("#city-picker").cityPicker({
            toolbarTemplate: '<header class="bar bar-nav">\
              <button class="button button-link pull-right close-picker">确定</button>\
              <h1 class="title">选择收货地址</h1>\
              </header>'
            });
        },
        async: true,
      });

      var address_edit_vm = avalon.define({
        $id: 'address_edit',
        warning: false,
        address: {},
        address_update: function() {
          check_required();
          if (!address_edit_vm.warning) {
            $.ajax({
              url: '/mshop/customer/address/update',
              data: {value: JSON.stringify({name: address_edit_vm.address.name, phone: address_edit_vm.address.phone, province: address_edit_vm.address.province, street: address_edit_vm.address.street, zip: address_edit_vm.address.zip, id: address_edit_vm.address.id}), partner_id: partner_id},
              success: function(e) {
                // window.history.back();
                $.router.back();
              },
              type: 'post',
              async: true,
            });
          };
        },
      });

      avalon.scan();
    });
  </script>

<% endblock %>
</div>